<template>
  <div class="oldMater">
    <div class="header">
      <jc-button
        :btn-arr="['remove', !fnumber && 'copy', 'pass', 'sub', 'save', 'reload', 'option', 'list']"
        :disab-arr="[isDisabled && 'save', 'close', 'cancel', 'copy', 'com1', 'com2', 'toExcel', 'chart']"
        :list="'/materielList'"
        @copyDa="copyMater"
        @refresh="handleControl"
        @save="preservation('A')"
        @submit="preservation('A',1)"
        @noSubmit="materSub(2)"
        @audit="Retrial(1)"
        @noAudit="Retrial(2)"
        @forbidden="using(1)"
        @startUsing="using(2)"
        @freeze="freeze(1)"
        @refreezing="freeze(2)"
        @del="delMater"
      />
      <el-button v-if="!fnumber" style="margin-left: 10px" type="primary" size="mini" @click="getIntoBom">进入bom</el-button>
      <el-button
        v-if="fnumber"
        type="primary"
        size="mini"
        style="margin-left: 10px"
        @click="copyMater"
      >
        {{ $t('market.copyMater') }}<!--        复制物料-->
      </el-button>
      <el-button size="mini" type="warning" @click="handleReverse">
        {{ $t('market.reverseBom') }}<!--反查bom-->
      </el-button>
    </div>
    <div class="organization">
      <el-form label-width="100px">
        <el-form-item v-for="(item, index) in organizationValue.largeName" :key="item" :label="(index + 1) + $t('market.materlen')">
          <el-input :value="item" size="mini" disabled />
        </el-form-item>
        <el-form-item :label="$t('market.state')">
          <el-tag :type="organizationValue.stateColor">{{ organizationValue.fdocumentStatus }}</el-tag>
        </el-form-item>
      </el-form>
    </div>
    <el-tabs v-model="activeName" @tab-click="handleOther">
      <el-tab-pane :label="$t('market.info')" name="basic">
        <jc-title :title1="$t('market.info1')" />
        <div class="information">
          <div class="images">
            <el-upload
              :show-file-list="false"
              :on-change="getFile"
              :auto-upload="false"
              class="avatar-uploader"
              action="/tBdMaterialgroupL/queryTBdMaterialgroupL"
              :disabled="isDisabled"
            >
              <img v-if="imageUrl" :src="imageUrl" class="avatar">
              <div v-if="imageUrl" class="magnify">
                <i class="el-icon-search" @click.stop="openImage = true" />
                <i class="el-icon-delete" @click.stop="deleteImg" />
              </div>
              <i v-else class="el-icon-plus avatar-uploader-icon" />
            </el-upload>
          </div>
          <div class="basics">
            <jc-form
              :option-value="basicValue"
              :options="basic"
              :all-disabled="isDisabled1"
              :fcontrol="showDis.fcontrol"
              @handleChange="handleChange"
            >
              <template v-slot:state>
                <el-input
                  v-model="basicValue.fmodel"
                  class="autoModel input_width"
                  size="mini"
                  :disabled="isDisabled"
                  @focus="aotuTab = true"
                  @keyup.enter.native="queryTBdMaterialList"
                />
                <div v-show="aotuTab" class="tabPosit" @click="aotuTab = false">
                  <el-table
                    :data="materialTableData"
                    height="38.4vh"
                    :cell-style="cellStyle1"
                    @row-click="material"
                  >
                    <el-table-column
                      :label="$t('market.fmaterial')"
                      prop="fnumber"
                      min-width="120px"
                      align="center"
                    />
                    <el-table-column
                      :label="$t('shop.name1')"
                      prop="fname"
                      min-width="120px"
                      align="center"
                    />
                    <el-table-column
                      :label="$t('market.fmodel')"
                      prop="fmodel"
                      min-width="160px"
                      align="center"
                    />
                    <el-table-column
                      :label="$t('market.descrip')"
                      prop="fdescripTion"
                      min-width="460px"
                      align="center"
                    />
                    <el-table-column
                      :label="$t('shop.specifica')"
                      prop="fspecificaTion"
                      align="center"
                      min-width="140px"
                    />
                  </el-table>
                  <div class="footer">
                    <jc-pagination
                      v-show="total > 0"
                      :total="total"
                      :page.sync="pageNum"
                      :limit.sync="pageSize"
                      @pagination="queryTBdMaterialList"
                    />
                  </div>
                </div>
              </template>
              <el-input
                v-model.trim="basicValue.fbaseUnit"
                size="mini"
                class="input_width"
                :disabled="isDisabled"
              >
                <i
                  slot="suffix"
                  class="el-input__icon el-icon-search"
                  @click="cliBaseUnit(1)"
                />
              </el-input>
            </jc-form>
          </div>
        </div>
        <jc-title :title1="$t('market.fince')" />
        <div class="control1">
          <el-form :model="finance" label-width="120px" :disabled="isDisabled1" size="mini">
            <el-form-item :label="$t('market.category')">
              <el-autocomplete
                ref="custom"
                v-model.trim="finance.fcategory"
                highlight-first-item
                popper-class="my-autocomplete"
                :fetch-suggestions="querySearch18"
                :disabled="isDisabled"
                @focus="getBasicUnit('SX_V_UNIT_CATEGORYID')"
                @select="selUnit"
              >
                <i
                  slot="suffix"
                  class="el-input__icon el-icon-search"
                  @click="cliUnit('SX_V_UNIT_CATEGORYID')"
                />
                <template slot-scope="{ item }">
                  <div class="name">{{ item.fname }}</div>
                </template>
              </el-autocomplete>
            </el-form-item>
            <el-form-item :label="$t('market.materialGroup')">
              <el-input v-model.trim="finance.fmaterialGroupName" :disabled="isDisabled">
                <i
                  slot="suffix"
                  class="el-input__icon el-icon-search"
                  @click="handleGroup"
                />
              </el-input>
            </el-form-item>
            <el-form-item :label="$t('market.researchPrice')">
              <el-input-number
                v-model.trim="finance.f_jc_salprice"
                class="input-width"
                :disabled="isDisabled"
                controls-position="right"
              />
            </el-form-item>
          </el-form>
        </div>
        <jc-title :title1="$t('market.detailInfo')" />
        <!--        <jc-form :option-value="controlValue" :options="control" />-->
        <div style="margin-top: 10px;margin-left: 50px;">
          <el-checkbox
            v-model="controlValue.fisasset"
            :label="$t('market.isasset')"
            :disabled="assetsDisabled || isDisabled1"
            @change="assets"
          />
          <el-checkbox
            v-model="controlValue.fisinventory"
            :label="$t('market.isinventory')"
            :disabled="checkoutDisabled || isDisabled1"
            @change="stock"
          />
          <el-checkbox
            v-model="controlValue.fisproduce"
            :label="$t('market.isproduce')"
            :disabled="checkoutDisabled || isDisabled1"
            @change="production"
          />
          <el-checkbox
            v-model="controlValue.fispurchase"
            :label="$t('market.ispurChase')"
            @change="fispurchase=!fispurchase"
          />
          <el-checkbox
            v-model="controlValue.fissale"
            :label="$t('market.issale')"
            :disabled="checkoutDisabled || isDisabled1"
            @change="sale"
          />
          <el-checkbox
            v-model="controlValue.fissubcontract"
            :label="$t('market.issubcontract')"
            :disabled="checkoutDisabled || isDisabled1"
            @change="outsourcing"
          />
        </div>
        <div class="materielAttribute">
          <!--          <jc-form :option-value="colorsValue" :options="colors" />-->
        </div>
        <el-divider class="weight" />
        <jc-form :options="weight" :option-value="weightValue" :all-disabled="isDisabled1">
          <!--    重量单位      -->
          <el-input
            v-model.trim="weightValue.fweightUnit"
            size="mini"
            class="input-width"
            disabled
          >
            <i
              slot="suffix"
              class="el-input__icon el-icon-search"
              @click="cliBaseUnit(4)"
            />
          </el-input>
        </jc-form>
        <el-divider class="dimensional" />
        <jc-form :option-value="dimensionalValue" :options="dimensional" :all-disabled="isDisabled1">
          <!--    尺寸单位      -->
          <el-input
            v-model.trim="dimensionalValue.fvolumeUnit"
            size="mini"
            class="input-width"
            disabled
          >
            <i
              slot="suffix"
              class="el-input__icon el-icon-search"
              @click="cliBaseUnit(3)"
            />
            <template slot-scope="{ item }">
              <div class="name">{{ item.fname }}</div>
            </template>
          </el-input>
        </jc-form>
        <!--        <jc-title :title1="$t('market.packvol')" style="margin-bottom: 5px;" />-->
        <!--        <jc-table-->
        <!--          :table-data="packingValue"-->
        <!--          :table-header="packing"-->
        <!--          table-height="200px"-->
        <!--          serial-->
        <!--        >-->
        <!--          <template v-slot:tagSlot="col">-->
        <!--            <el-input-->
        <!--              v-model.trim="col.scope.row.fname"-->
        <!--              class="input-width"-->
        <!--              size="mini"-->
        <!--              :disabled="isDisabled"-->
        <!--            >-->
        <!--              <i-->
        <!--                slot="suffix"-->
        <!--                class="el-input__icon el-icon-search"-->
        <!--                @click="cliBaseUnit(2, col.scope.$index)"-->
        <!--              />-->
        <!--            </el-input>-->
        <!--          </template>-->
        <!--          <template v-slot:billSlot="col">-->
        <!--            <el-input-number v-model="col.scope.row.fGrossweight" size="mini" :disabled="isDisabled" />-->
        <!--          </template>-->
        <!--          <template v-slot:btnState="col">-->
        <!--            <el-input-number v-model="col.scope.row.fNetweight" size="mini" :disabled="isDisabled" />-->
        <!--          </template>-->
        <!--          <template v-slot:btnStates="col">-->
        <!--            <el-input-number v-model="col.scope.row.fLength" size="mini" :disabled="isDisabled" />-->
        <!--          </template>-->
        <!--          <template v-slot:text2Slot="col">-->
        <!--            <el-input-number v-model="col.scope.row.fWidth" size="mini" :disabled="isDisabled" />-->
        <!--          </template>-->
        <!--          <template v-slot:text3Slot="col">-->
        <!--            <el-input-number v-model="col.scope.row.fHeight" size="mini" :disabled="isDisabled" />-->
        <!--          </template>-->
        <!--        </jc-table>-->
        <!--物料属性-->
        <jc-title :title1="$t('market.ferpcls')" style="margin-bottom: 5px;" />
        <jc-property
          :fnumber="basicValue.fnumber"
          :detail-disabled="isDisabled || isDisabled1"
          :fid="basicValue.flargecode"
          @perty="pertyData"
          @copyMaterielValue="pertyData"
        />
      </el-tab-pane>
      <el-tab-pane :label="$t('market.stocknum')" name="inventory">
        <jc-inventory
          :information="information"
          :detail-disabled="isDisabled || isDisabled1"
          :unit="units"
        />
      </el-tab-pane>
      <el-tab-pane :label="$t('market.sales')" name="market">
        <jc-market :company="company" :unit="units" :detail-disabled="isDisabled || isDisabled1" />
      </el-tab-pane>
      <el-tab-pane :label="$t('market.purchase')" name="information">
        <jc-information
          :information="information"
          :detail-disabled="isDisabled || isDisabled1"
          :unit="units"
        />
      </el-tab-pane>
      <el-tab-pane :label="$t('market.production')" name="production">
        <jc-production :company="company" :detail-disabled="isDisabled || isDisabled1" :unit="units" />
      </el-tab-pane>
      <el-tab-pane :label="$t('market.machin')" name="machining" class="machining">
        <datum ref="datum" :basic-value="basicValue" :fmaterial-id="fmaterialId" :fnumber="basicValue.fnumber" />
      </el-tab-pane>
      <el-tab-pane :label="$t('market.record1')" name="log">
        <jc-form :option-value="otherUrlObject" :options="otherOptions" />
        <jc-table
          :table-header="logTableHeader"
          :table-data="otherLogTableData"
          serial
          table-height="63vh"
        />
        <jc-pagination
          v-show="total > 0"
          :total="total"
          :page.sync="pageNum"
          :limit.sync="size"
          @pagination="handleOther"
        />
      </el-tab-pane>
    </el-tabs>
    <!--    预览图片-->
    <el-dialog
      v-dialogDrag
      :title="$t('market.preview')"
      :visible.sync="openImage"
      :close-on-click-modal="false"
      close-on-press-escape
    >
      <div class="preview">
        <img :src="imageUrl" alt="预览图片" class="previewImg">
      </div>
    </el-dialog>
    <el-dialog
      v-dialogDrag
      :title="$t('market.materialGroup')"
      model
      :visible.sync="openCustomer"
      :close-on-click-modal="false"
      width="30%"
    >
      <div class="public-form">
        <el-tree
          :data="fgroupArray"
          :props="defaultProps"
          @node-click="handleNodeClick"
        />
      </div>
    </el-dialog>
    <!--  数据字典弹窗  -->
    <unit v-if="unitVisabled" :msg="funit" @unit="selUnit" />
    <!--  基本 重量 尺寸  -->
    <baseUnit v-if="isBaseUnit" :msg="fisbaseunit" @unit="selBaseunit" />
    <jc-reverse ref="mychild" :mat-id="fmaterialId" />
  </div>
</template>

<script>
import jcForm from '@/components/Form'
import jcTitle from '@/components/Title'
import jcInformation from '../../createMateriel2/components/Information'
import {
  deleteMaterial,
  queryMaterialDetail,
  queryMaterialLog
} from '@/api/basicManagement/materielList'
import {
  insertMaterial, queryUserGroup,
  updateMaterial
} from '@/api/basicManagement/createMateriel'
import {
  updateMaterialNotReview,
  materialSubmit,
  materialUnSubmit,
  materialAudit, materialDisable, materialUnDisable, materialRozen, materialUnRozen
} from '@/api/basicManagement/untreatedMaterie'
import jcFormFunction from '@/components/Form/FormFunction'
import mixinscom from '@/views/basic/createMateriel2/components/mixinscom'
import { queryTBdStockList, queryViewItem } from '@/api/marketManage/marketOrder'
import jcInventory from '@/views/basic/createMateriel2/components/inventory'
import jcMarket from '@/views/basic/createMateriel2/components/market'
import jcProduction from '@/views/basic/createMateriel2/components/production'
import autocomplete from '@/views/market/marketManage/createMarkerOrder/components/autocomplete'
import jcProperty from '@/views/basic/createMateriel2/components/property'

import jcButton from '@/components/Button'
import operability from '@/mixin/Operability'
import jcReverse from '@/views/engineering/treeBom/reverse'

export default {
  name: 'OldetailMateriel',
  components: {
    jcForm,
    jcReverse,
    jcInformation,
    jcInventory,
    jcMarket,
    jcProperty,
    jcProduction,
    jcTitle,
    datum: () => import('@/views/basic/createMateriel2/components/datum'),
    unit: () => import('@/views/basic/createMateriel2/components/unit'),
    baseUnit: () => import('@/views/basic/createMateriel2/components/baseUnit'),
    jcButton
  },
  mixins: [jcFormFunction, mixinscom, autocomplete, operability],
  props: {
    fnumber: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      funit: '',
      unitVisabled: false,
      isBaseUnit: false,
      fisbaseunit: false,
      checkoutDisabled: false,
      assetsDisabled: false,
      openCustomer: false,
      treeClickCount: 0, // tree点击次数
      fgroupArray: [],
      defaultProps: {
        children: 'details',
        label: 'fname'
      },
      packingValue: [],
      packing: [
        { label: this.$t('market.weightUnit'), prop: 'fname', type: 'tag' },
        { label: this.$t('market.grossweight'), prop: 'fGrossweight', type: 'bill' },
        { label: this.$t('market.netweight'), prop: 'fNetweight', type: 'state' },
        { label: this.$t('market.length'), prop: 'fLength', type: 'states' },
        { label: this.$t('market.width'), prop: 'fWidth', type: 'text2' },
        { label: this.$t('market.height'), prop: 'fHeight', type: 'text3' }
      ],
      activeName: 'basic',
      total: 0, // 总条目
      cellStyle1: { padding: '0' }, // 行高
      imageUrl: '', // 上传图片
      pageNum: 1, // 当前页
      size: 200, // 每页显示多少条数据
      openImage: false, // 打开图片
      isDisabled: false,
      dialogApi: Function, // 弹窗api
      property: [], // 物料属性
      fweightUnitId: '', // 重量单位
      fvolumeUnitId: '', // 尺寸单位
      fmaterialId: '', // id
      otherUrlObject: {}, // 其它审核人
      otherOptions: {
        fcreator: { label: this.$t('market.creator'), span: 6, disabled: 'disabled' },
        fcreateDate: { label: this.$t('market.createDate'), span: 6, disabled: 'disabled' },
        fmodifier: { label: this.$t('market.modifier'), span: 6, disabled: 'disabled' },
        fmodifyDate: { label: this.$t('market.modifyDate'), span: 6, disabled: 'disabled' },
        fapprover: { label: this.$t('market.approver'), span: 6, disabled: 'disabled' },
        fapproveDate: { label: this.$t('market.approveDate'), span: 6, disabled: 'disabled' },
        fforbider: { label: this.$t('market.forbider'), span: 6, disabled: 'disabled' },
        fforbidDate: { label: this.$t('market.forbidDate'), span: 6, disabled: 'disabled' }
      }, // 其它审核人控件
      otherLogTableData: [], // 日志数据
      imagesValue: {}, // 图片值
      imagesOptions: {}, // 图片控件
      dimensionalValue: {}, // 尺寸值
      dimensional: {}, // 尺寸控件
      weightValue: {}, // 重量数据
      weight: {}, // 重量控件
      controlValue: {}, // 控制数据
      control: {}, // 控制控件
      financeValue: {}, // 财务
      finance: {}, // 财务
      statuss: {}, // 状态
      statusValue: {}, // 状态
      basicValue: {}, // 基本数据
      basic: {}, // 基本控件
      organizationValue: {}, // 组织值
      organization: {}, // 组织控件
      logTableHeader: [
        { label: this.$t('market.fdate'), prop: 'createDate' },
        { label: this.$t('market.operator'), prop: 'fname' },
        { label: this.$t('market.deaprt'), prop: 'fdeaprt' },
        { label: this.$t('market.record'), prop: 'fip' },
        { label: this.$t('market.describe'), prop: 'fdescribe' }
      ],
      basicUnit: [], // 基本单位
      materielType: [], // 物料类型
      fdocumentStatus: '', // 状态
      materAttribute: {},
      information: {},
      weightData: [], // 重量单位
      volumeData: [], // 尺寸单位
      fpaezData: [],
      copy: '',
      units: {},
      company: {} // 单位
    }
  },
  watch: {
    fnumber(val) {
      if (val) {
        this.handleControl(val)
        this.$refs.datum.getMaterialGroupL()
      }
    }
  },
  created() {
    this.getMaterielType()
    this.fsuiteDataType()
    this.handleControl()
    this.fsuiteDataType()
  },
  methods: {
    handleChange(ev) {
      this.packingValue = []
      this.fpaezData.forEach(res => {
        if (res.value === ev) {
          this.packingValue.length = res.packQty
          this.packingValue = Array.from({ length: res.packQty }, () => ({
            fname: '千克',
            fWeightunitId: 36, // ID值
            fGrossweight: 0,
            fNetweight: 0,
            fLength: 0,
            fWidth: 0,
            fHeight: 0
          }))
        }
      })
    },
    copyMater() {
      if (this.fnumber) {
        this.$emit('showMateriel', this.basicValue.fnumber)
      } else {
        this.$router.push({
          name: 'CreateMateriel2',
          params: {
            id: this.basicValue.fnumber
          }
        })
      }
    },
    pertyData(ev) {
      this.property = ev
    },
    // 保存物料
    async preservation(ev, en) {
      this.materAttribute = {}
      this.property.forEach(item => {
        this.$set(this.materAttribute, item.lable, item.value + '' || '')
        this.$set(this.materAttribute, item.valus, item.name || '')
      })
      const {
        fbaseUnitId,
        fbarCode,
        ferpclsId,
        fnames,
        fsuite,
        fmodel,
        fspecificaTion,
        fremarks,
        fcall,
        fissuetypeId,
        fdescripTion,
        fnumber,
        flargename,
        flargecode,
        fDictionaryId
      } = this.basicValue
      const {
        fvolumeUnitId,
        fvolumeUnit,
        fperimeter,
        flength,
        fvolume,
        fwidth,
        fheight,
        fthickness,
        fopenLength,
        fopenVolume,
        fopenThickness,
        fopenWidth,
        fopenHeight
      } = this.dimensionalValue
      const {
        fweightUnit,
        fweightUnitId,
        fgrossWeight,
        fnetWeight
      } = this.weightValue
      const DATA = {
        fcontrol: this.showDis.fcontrol,
        fspecjoinid: this.showDis.fspecjoinid,
        fattrjoinid: this.showDis.fattrjoinid,
        fDictionaryId,
        packList: this.packingValue,
        fnumber,
        flargename,
        flargecode,
        ...this.organizationValue, // 物料编码
        ...this.materAttribute, // 物料属性组合,
        fdocumentStatus: ev,
        fmaterialId: this.$route.query.fmaterialId || this.fmaterialId,
        // 允许采购
        fispurchase: this.fispurchase,
        // 允许销售
        fissale: this.fissale,
        // 允许库存
        fisinventory: this.fisinventory,
        // 允许生产
        fisproduce: this.fisproduce,
        // 允许委外
        fissubcontract: this.fissubcontract,
        // 允许资产
        fisasset: this.fisasset,
        fbaseUnitId,
        fissuetypeId,
        fbarCode,
        ferpclsId,
        fsuite,
        fmodel,
        fnames,
        fspecificaTion,
        // 物料备注
        fremarks,
        // 物料简称
        fcall,
        fdescripTion,
        fvolumeUnitId,
        fvolumeUnit,
        fperimeter,
        fvolume,
        fthickness: Number(fthickness),
        flength,
        fwidth,
        fheight,
        fopenWidth,
        fopenHeight,
        fopenVolume,
        fopenThickness,
        fopenLength,
        fweightUnit,
        fweightUnitId,
        fgrossWeight,
        fnetWeight,
        fimg: this.imageUrl
      }
      Object.assign(DATA, this.information, this.company, this.finance)
      const CHECKOUT = [
        this.fisasset,
        this.fisinventory,
        this.fisproduce,
        this.fispurchase,
        this.fissale,
        this.fissubcontract
      ]
      const RES = CHECKOUT.every(item => {
        return item === false
      })
      if (RES === true) {
        this.$message.warning({ message: '控制信息必选一项！' })
        return
      }
      const edit = async() => {
        const { code, message } = await updateMaterial(DATA)
        if (code !== 0) {
          this.$message.warning({ message })
          return
        }
        en === 1 ? this.materSub(1) : this.handleControl(fnumber)
        this.$message({ showClose: true, message: message, type: 'success' })
      }
      const insert = async() => {
        const { code, message } = await insertMaterial(DATA)
        if (code !== 0) {
          this.$message.warning({ message })
          return
        }
        this.copy = ''
        this.handleControl(fnumber)
        this.$message({ showClose: true, message: message, type: 'success' })
      }
      if (this.copy === 'copy') {
        await insert()
      } else {
        await edit()
      }
    },
    // 删除上传图片
    deleteImg() {
      this.imageUrl = ''
    },
    // 基本单位
    cliBaseUnit(ev, index) {
      this.indexSelf = index
      this.unitype = ev
      this.isBaseUnit = true
      this.fisbaseunit = ev === 1
    },
    selBaseunit(ev) {
      if (ev.funitid) {
        if (this.unitype === 1) {
          // 基本单位
          this.basicValue.fbaseUnit = ev.fname
          this.basicValue.fbaseUnitId = ev.funitid
          this.units = {
            fname: ev.fname,
            fid: ev.funitid
          }
        } else if (this.unitype === 2) {
          // 重量单位
          this.packingValue[this.indexSelf].fname = ev.fname
          this.packingValue[this.indexSelf].fWeightunitId = ev.funitid
        } else if (this.unitype === 3) {
          // 尺寸单位
          this.dimensionalValue.fvolumeUnit = ev.fname
          this.dimensionalValue.fvolumeUnitId = ev.funitid
        } else if (this.unitype === 4) {
          // 重量单位
          this.weightValue.fweightUnit = ev.fname
          this.weightValue.fweightUnitId = ev.funitid
        }
      }
      this.isBaseUnit = false
    },
    cliUnit(ev, en) {
      this.funit = ev
      this.unitype = en
      this.unitVisabled = true
    },
    // 重量单位
    selUnit(ev) {
      if (ev.fid) {
        if (this.funit === 'SX_V_UNIT_TAXRATEID') {
          // 税率
          this.finance.ftaxRate = ev.fname
          this.finance.ftaxRateId = ev.fid
        } else if (this.funit === 'SX_V_UNIT_CATEGORYID') {
          // 存货类别
          this.finance.fcategory = ev.fname
          this.finance.fcategoryId = ev.fid
        }
      }
      this.unitVisabled = false
    },
    // 获取物料类型
    async getMaterielType() {
      const { data: RES } = await queryViewItem({
        viewName: 'SX_V_UNIT_ERPCLSID'
      })
      this.materielType = RES.list.map(item => {
        const { fname: label, fid: value } = item
        return { label, value }
      })
    },
    // 获取套件
    async fsuiteDataType() {
      const { data: RES } = await queryViewItem({ viewName: 'SX_V_UNIT_SUITE' })
      this.fsuiteData = RES.list.map(item => {
        const { fname: label, fid: value } = item
        return { label, value }
      })
    },
    // 包装方式
    async fpaezDataType() {
      const { data: RES } = await queryTBdStockList({})
      return RES.list.map(item => {
        const { fname: label, fid: value, packQty } = item
        return { label, value, packQty }
      })
    },
    // 打开物料分组
    async handleGroup() {
      this.openCustomer = true
      const { data: res } = await queryUserGroup({})
      this.fgroupArray = res
    },
    // 物料分组
    handleNodeClick(item) {
      this.treeClickCount++
      if (this.treeClickCount >= 2) return
      this.timer = window.setTimeout(() => {
        if (this.treeClickCount === 1) {
          this.treeClickCount = 0
        } else if (this.treeClickCount > 1) {
          this.treeClickCount = 0
          const { fid, fname } = item
          this.finance.fmaterialGroup = fid
          this.finance.fmaterialGroupName = fname
          this.openCustomer = false
        }
      }, 300)
    },
    // 详情
    async handleControl(ev) {
      const fnumber = this.fnumber || ev || this.$route.params.id
      if (fnumber === '请添加数据' || !fnumber) {
        return
      }
      // 包装方式
      this.fpaezData = await this.fpaezDataType()
      await queryMaterialDetail({ fnumber })
        .then(RES => {
          if (RES.code === 1) {
            this.$confirm(RES.message, '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'error'
            })
            return
          }
          const {
            fissuetypeId,
            funit,
            fdescripTion,
            ferpcls,
            fheight,
            fisasset,
            fisinventory,
            fisproduce,
            fispurChase,
            fissale,
            fissubcontract,
            fvolumeUnit,
            fperimeter,
            fvolumeUnitId,
            fthickness,
            fopenlength,
            fopenvolume,
            fopenthickness,
            fopenwidth,
            fopenheight,
            flength,
            fmnemoniccode,
            ferpclsId,
            fnames,
            fnumber,
            fsuite,
            fvolume,
            fwidth,
            groupname,
            fbaseUnitId,
            flargename,
            fmaterialId,
            fremarks,
            fbarCode,
            fmodel,
            fimg,
            fspecificaTion,
            fminStock, // 最小库存
            fsafeStock, // 安全库存
            fmaxStock,
            fpurchaseUnit,
            fpurchaseUnitId,
            fdefaultvendor,
            fstoreUnit,
            fstoreUnitId,
            fstock,
            fstockId,
            fstockPlaceId,
            fstockPlaceName,
            fworkshop,
            fworkshopId,
            fproduceUnit,
            fproduceUnitId,
            fissueType,
            fpickStock,
            fpickStockId,
            fpickbinId,
            fsaleUnit,
            fsaleUnitId,
            foutStocklmth,
            foutStocklmtl,
            ffinishreceiptoverRate,
            ffinishreceiptshortRate,
            ftaxRate,
            ftaxRateId,
            fcategory,
            fcategoryId,
            fdocumentStatus, // 审核状态
            fcreator, // 操作记录
            fcreateDate,
            fmodifier,
            fmodifyDate,
            fapprover,
            fapproveDate,
            fforbider,
            fforbidDate,
            fpurchasecheck,
            fproducecheck,
            fmaterialGroup,
            fmaterialGroupName,
            fpurchasepriceUnit,
            fpurchasepriceUnitId,
            size,
            flargecode,
            f_jc_salprice,
            packList,
            fweightUnit,
            fweightUnitId,
            fgrossweight,
            fnetweight,
            fDictionaryId
          } = RES.data
          this.packingValue = packList
          this.showDis = size
          this.isDisabled =
            fdocumentStatus === this.$t('market.state1') || fdocumentStatus === this.$t('market.state2')
          this.fdocumentStatus = fdocumentStatus
          this.finance = { f_jc_salprice, ftaxRate, ftaxRateId, fcategory, fcategoryId, fmaterialGroup, fmaterialGroupName }
          this.fmaterialId = fmaterialId
          this.imageUrl = fimg
          this.information = {
            fpurchasepriceUnit,
            fpurchasepriceUnitId,
            fpurchasecheck,
            fpurchaseUnit,
            fpurchaseUnitId,
            fdefaultvendor,
            fstoreUnit,
            fstoreUnitId,
            fstock,
            fstockId,
            fstockPlaceId,
            fstockPlaceName,
            fminStock,
            fsafeStock,
            fmaxStock
          }
          this.company = {
            fproducecheck,
            fworkshop,
            fworkshopId,
            fproduceUnit,
            fproduceunitId: fproduceUnitId,
            fissueType,
            fpickStock,
            fpickStockId,
            fpickbinId,
            fsaleUnit,
            fsaleUnitId,
            foutStocklmth,
            foutStocklmtl,
            ffinishreceiptoverRate,
            ffinishreceiptshortRate
          }
          this.otherUrlObject = {
            fcreator,
            fcreateDate,
            fmodifier,
            fmodifyDate,
            fapprover,
            fapproveDate,
            fforbider,
            fforbidDate
          }
          this.organizationValue = {
            largeName: flargename,
            fdocumentStatus: fdocumentStatus
          }
          this.basicValue = {
            fDictionaryId,
            flargename,
            flargecode,
            fmnemoniccode,
            fnumber,
            groupname,
            ferpcls,
            ferpclsId,
            fsuite,
            fbaseUnit: funit,
            fbaseUnitId,
            fdescripTion,
            fspecificaTion,
            fnames,
            fmodel,
            fissuetypeId,
            fremarks,
            fbarCode // 隐藏
          }
          this.basic = {
            fmodel: {
              label: this.$t('market.fmodel2'),
              type: 'autoTemplate',
              span: 6,
              labelWidth: '100px',
              disabled: this.isDisabled
            },
            fnumber: {
              label: this.$t('market.fmaterial'),
              span: 6,
              labelWidth: '100px',
              disabled: true
            },
            fnames: {
              label: this.$t('shop.fname2'),
              span: 6,
              labelWidth: '100px',
              disabled: this.isDisabled
            },
            fspecificaTion: {
              label: this.$t('shop.fspecificaTion'),
              labelWidth: '100px',
              disabled: this.isDisabled,
              type: 'text1',
              span: 6
            },
            fbaseUnit: {
              label: this.$t('market.baseUnit'),
              type: 'slot',
              span: 6,
              labelWidth: '100px',
              disabled: this.isDisabled
            },
            ferpclsId: {
              label: this.$t('market.ferpclsId'),
              span: 6,
              type: 'select',
              labelWidth: '100px',
              selectItems: this.materielType,
              disabled: this.isDisabled
            },
            fsuite: {
              label: this.$t('market.suite'),
              span: 6,
              type: 'select',
              labelWidth: '100px',
              selectItems: this.fsuiteData,
              disabled: this.isDisabled
            },
            fremarks: {
              label: this.$t('market.fremark'),
              labelWidth: '100px',
              disabled: this.isDisabled,
              span: 6
            },
            fDictionaryId: {
              label: this.$t('market.fpaezAssistant'),
              span: 6,
              type: 'select',
              selectItems: this.fpaezData,
              disabled: this.isDisabled,
              labelWidth: '100px'
            },
            fdescripTion: {
              label: this.$t('market.fdescripTion'),
              type: 'textarea',
              labelWidth: '100px',
              disabled: this.isDisabled,
              span: 12
            }
          }
          this.controlValue = {
            fisasset: fisasset === '1',
            fisinventory: fisinventory === '1',
            fisproduce: fisproduce === '1',
            fispurchase: fispurChase === '1',
            fissale: fissale === '1',
            fissubcontract: fissubcontract === '1'
          }
          const isDisabled =
            this.fdocumentStatus === this.$t('market.state1') ||
            this.fdocumentStatus === this.$t('market.state2')
          this.fispurchase = fispurChase === '1'
          this.fissale = fissale === '1'
          this.fisinventory = fisinventory === '1'
          this.fisproduce = fisproduce === '1'
          this.fissubcontract = fissubcontract === '1'
          this.fisasset = fisasset === '1'
          this.control = {
            fisasset: {
              label: this.$t('market.isasset'),
              type: 'checkbox',
              span: 2,
              disabled: isDisabled
            },
            fisinventory: {
              label: this.$t('market.isinventory'),
              type: 'checkbox',
              span: 2,
              disabled: isDisabled
            },
            fisproduce: {
              label: this.$t('market.isproduce'),
              type: 'checkbox',
              span: 2,
              disabled: isDisabled
            },
            fispurchase: {
              label: this.$t('market.ispurChase'),
              type: 'checkbox',
              span: 2,
              disabled: isDisabled
            },
            fissale: {
              label: this.$t('market.issale'),
              type: 'checkbox',
              span: 2,
              disabled: isDisabled
            },
            fissubcontract: {
              label: this.$t('market.issubcontract'),
              type: 'checkbox',
              span: 2,
              disabled: isDisabled
            }
          }
          this.weightValue = {
            fweightUnit,
            fweightUnitId,
            fgrossWeight: fgrossweight,
            fnetWeight: fnetweight
          }
          this.weight = {
            fweightUnit: {
              label: this.$t('market.weightUnit'),
              type: 'slot',
              span: 4.01,
              disabled: isDisabled
            },
            fgrossWeight: {
              label: this.$t('market.grossweight'),
              span: 4.01,
              labelWidth: '120px',
              disabled: isDisabled
            },
            fnetWeight: {
              label: this.$t('market.netweight'),
              span: 4.01,
              labelWidth: '120px',
              disabled: isDisabled
            }
          }
          this.dimensionalValue = {
            fvolumeUnit,
            fperimeter,
            flength,
            fvolume,
            fwidth,
            fheight,
            fvolumeUnitId,
            fthickness,
            fopenLength: fopenlength,
            fopenVolume: fopenvolume,
            fopenThickness: fopenthickness,
            fopenWidth: fopenwidth,
            fopenHeight: fopenheight
          }

          this.dimensional = {
            fvolumeUnit: {
              label: this.$t('market.volumeUnit'),
              type: 'slot',
              span: 4.8,
              disabled: isDisabled
            },
            fperimeter: {
              label: this.$t('market.perimeter'),
              disabled: isDisabled,
              type: 'number',
              span: 18
            },
            flength: {
              label: this.$t('market.length'),
              span: 4.1,
              type: 'number',
              disabled: isDisabled || !this.showDis.flength
            },
            fwidth: {
              label: this.$t('market.width'),
              span: 4.1,
              type: 'number',
              disabled: isDisabled || !this.showDis.fwidth
            },
            fheight: {
              label: this.$t('market.height'),
              span: 4.1,
              type: 'number',
              disabled: isDisabled || !this.showDis.fheight
            },
            fthickness: {
              label: this.$t('market.thickness'),
              span: 4.1,
              type: 'number',
              disabled: isDisabled || !this.showDis.fthickness
            },
            fvolume: {
              label: this.$t('market.volume'),
              type: 'number',
              disabled: isDisabled || !this.showDis.fvolume,
              span: 4.1
            },
            fopenLength: {
              label: this.$t('market.openlength'),
              span: 4.1,
              type: 'number',
              disabled: isDisabled || !this.showDis.fopenlength
            }
            // fopenWidth: {
            //   label: this.$t('market.openwidth'),
            //   span: 4.1,
            //   type: 'number',
            //   disabled: isDisabled || !this.showDis.fopenwidth
            // },
            // fopenHeight: {
            //   label: this.$t('market.openheight'),
            //   span: 4.1,
            //   type: 'number',
            //   disabled: isDisabled || !this.showDis.fopenheight
            // },
            // fopenThickness: {
            //   label: this.$t('market.openthickness'),
            //   span: 4.1,
            //   type: 'number',
            //   disabled: isDisabled || !this.showDis.fopenthickness
            // },
            // fopenVolume: {
            //   label: this.$t('market.openvolume'),
            //   span: 4.1,
            //   type: 'number',
            //   disabled: isDisabled || !this.showDis.fopenvolume
            // }
          }
        })
        .catch(error => {
          this.$message.error(error)
        })
    },
    // 点击tab
    handleOther(tab) {
      if (tab.name === 'log') {
        this.handleOther1()
      } else if (tab.name === 'machining') {
        this.$refs.datum.getMaterialGroupL()
      }
    },
    // 允许资产
    assets() {
      this.fisasset = !this.fisasset
      if (this.fisasset) {
        this.fispurchase = true
        this.fisinventory = false
        this.fisproduce = false
        this.fissale = false
        this.fissubcontract = false
        this.checkoutDisabled = true
      } else if (!this.fisasset) {
        this.fispurchase = false
        this.fisinventory = false
        this.fisproduce = false
        this.fissale = false
        this.fissubcontract = false
        this.checkoutDisabled = false
      }
    },
    // 允许库存
    stock() {
      this.fisinventory = !this.fisinventory
      if (this.fisinventory) {
        this.assetsDisabled = true
      } else if (
        !this.fissubcontract &&
        !this.fissale &&
        !this.fisproduce &&
        !this.fisinventory
      ) {
        this.assetsDisabled = false
      }
    },
    // 允许生产
    production() {
      this.fisproduce = !this.fisproduce
      if (this.fisproduce) {
        this.assetsDisabled = true
      } else if (
        !this.fissubcontract &&
        !this.fissale &&
        !this.fisproduce &&
        !this.fisinventory
      ) {
        this.assetsDisabled = false
      }
    },
    // 允许销售
    sale() {
      this.fissale = !this.fissale
      if (this.fissale) {
        this.assetsDisabled = true
      } else if (
        !this.fissubcontract &&
        !this.fissale &&
        !this.fisproduce &&
        !this.fisinventory
      ) {
        this.assetsDisabled = false
      }
    },
    // 允许委外
    outsourcing() {
      this.fissubcontract = !this.fissubcontract
      if (this.fissubcontract) {
        this.assetsDisabled = true
      } else if (
        !this.fissubcontract &&
        !this.fissale &&
        !this.fisproduce &&
        !this.fisinventory
      ) {
        this.assetsDisabled = false
      }
    },
    // 反查bom
    handleReverse() {
      this.$refs.mychild.getBomFatherList()
    },
    // 公共函数
    toExamineFun(api) {
      const DATA = { Numbers: [this.fnumber || this.$route.params.id] }
      api(DATA).then(res => {
        if (res.code !== 0) {
          this.$confirm(res.message, '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'error'
          })
          return
        }
        this.selectFbi = []
        this.innerHTM = ''
        res.data.forEach(res => {
          this.innerHTM += '<div>' + res + '</div>'
        })
        this.$notify.warning({
          title: '提示',
          message: this.innerHTM,
          duration: 3000, offset: 50,
          dangerouslyUseHTMLString: true
        })
        this.handleControl()
      })
    },
    // 审核
    async Retrial(ev) {
      const api = ev === 1 ? materialAudit : updateMaterialNotReview
      this.toExamineFun(api)
    },
    // 提交
    async materSub(ev) {
      const api = ev === 1 ? materialSubmit : materialUnSubmit
      this.toExamineFun(api)
    },
    // 禁用反禁用
    async using(ev) {
      const api = ev === 1 ? materialDisable : materialUnDisable
      this.toExamineFun(api)
    },
    // 冻结反冻结
    async freeze(ev) {
      const api = ev === 1 ? materialRozen : materialUnRozen
      this.toExamineFun(api)
    },
    // 删除
    delMater() {
      this.$confirm('确定要删除么？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'danger'
      }).then(() => {
        const DATA = { Numbers: [this.$route.params.id || this.fnumber] }
        deleteMaterial(DATA).then(res => {
          if (res.code !== 0) {
            this.$confirm(res.message, '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'error'
            })
            return
          }
          this.$store.dispatch('tagsView/guanbi', this.$route)
          this.$router.push({ path: '/materielList' })
        })
      })
    },
    // 进入bom
    async getIntoBom() {
      const FNUMBER = this.$route.params.id
      this.$router.push({ path: `/treeBom/${FNUMBER}` })
    },
    // 获取其它
    async handleOther1() {
      const DATA = {
        pageNum: this.pageNum,
        pageSize: this.size,
        fbillNo: this.$route.params.id || this.fnumber
      }
      const RES = await queryMaterialLog(DATA)
      this.total = RES.data.total
      this.otherLogTableData = RES.data.array
    }
  }
}
</script>

<style scoped lang="scss">
.oldMater {
  @include createMateriel;
  min-width: 1600px;
  background: #fff;
  padding: 6px;
  .header {
    display: flex;
    margin-bottom: 10px;
  }
  .images {
    position: relative;
  }
  .basics {
    width: 80%;
  }
  .control1 {
    margin: 8px 0;
  }
  .el-card {
    &::v-deep .el-card__body {
      padding: 0;
    }
  }
  .el-tabs {
    background: #ffffff;
    padding: 0 5px;
    &::v-deep .el-tabs__content {
      min-height: 77vh !important;
    }
  }
  .machining {
    display: flex;
    justify-content: space-around;
    width: 100%;
  }
}
.organization {
  margin-bottom: 10px;
}
.avatar-uploader {
  @include upLoad;
}
.avatar-uploader:hover .magnify {
  display: block;
}
.magnify {
  display: none;
  height: 120px;
  width: 120px;
  background-color: rgba(0, 0, 0, 0.4);
  position: absolute;
  top: 0;
  line-height: 120px;
  border-radius: 6px;

  i {
    font-size: 24px;
    color: #fff;
    padding: 0 15px;
  }
}
.preview {
  display: flex;
  justify-content: center;
  align-items: center;
  .previewImg {
    max-width: 600px;
    max-height: 600px;
  }
}
.tabPosit {
  padding: 5px;
  box-shadow: 0 0 2px #aaa;
  position: absolute;
  top: 40px;
  left: 0;
  background-color: rgba(255, 255, 255, 1);
  z-index: 9999;
}
.el-input::v-deep .el-input__inner {
  height: 30px;
  line-height: 30px;
}
.el-form {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  .el-form-item {
    height: 30px;
    width: 275px;
    margin-bottom: 0;
    .btnType {
      margin-right: 20px;
    }

    .el-date-editor.el-input {
      width: 100% !important;
    }

    .el-select {
      width: 100%;
    }
  }
}
.machining {
  display: flex;
  justify-content: space-around;
  width: 500px;
  .magnify {
    display: none;
    height: 120px;
    width: 120px;
    background-color: rgba(0, 0, 0, 0.4);
    position: absolute;
    top: 12px;
    line-height: 120px;
    border-radius: 6px;

    i {
      font-size: 24px;
      color: #fff;
      padding: 0 15px;
    }
  }
}
</style>
